<template>
  <div>
    <table-ext :columns="columns" :searchForm="searchForm" :config="config" ref="tableExt">
      <template slot="table-action">
        <el-button type="primary" icon="el-icon-download">导出价格</el-button>
        <el-button type="info" icon="el-icon-upload2">加入清单</el-button>
        <el-button type="primary" icon="el-icon-tickets">对比清单</el-button>
      </template>
    </table-ext>
  </div>
</template>
<script>
  import TableExt from '@/components/common/table-ext/table-ext.vue';
  import TableIcon from '@/components/common/table-ext/table-icon';
  export default {
    // 引入自定义表格组件
    components: {
      'table-ext': TableExt
    },
    data() {
      return {

        config: { // 页面共通配置
          title: '已报价', //页面标题
          isPage: true, //是否分页
          isNo: true, //是否显示序号
          selection: true, //是否显示复选框
          crudMapping: { // CRUD方法
            query: {
              url: this.lib.config.host.rfq + '/ctmgt/rfq/enquiry/compare/contrast/' + this.$route.query.id
            }
          }
        },
        // 查询表单配置
        searchForm: [{
          label: '采购组织',
          key: 'purOrgName',
          type: 'input'
        }, {
          label: '物料名称',
          key: 'materialName',
          type: 'input'
        }, {
          label: '供应商名称',
          key: 'vendorName',
          type: 'input'
        }, {
          label: '价格状态',
          key: 'rejectQuoteStatus',
          type: 'select',
          dict: [{
            key: '0',
            value: '未驳回'
          }, {
            key: '-1',
            value: '已驳回'
          }]
        }, {
          label: '条款状态',
          key: 'rejectClauseStatus',
          type: 'select',
          dict: [{
            key: '0',
            value: '未驳回'
          }, {
            key: '-1',
            value: '已驳回'
          }]
        }],
        // 表格列定义
        columns: [{
            label: '驳回状态',
            key: 'rejectQuoteStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.rejectQuoteStatus,
                  titles: [{
                    status: 0,
                    title: '未驳回'
                  }, {
                    status: -1,
                    title: '已驳回'
                  }]
                }
              });
            }
          },
          {
            label: '有效状态',
            key: 'validStatus',
            render: (createElement, params) => { //动态渲染, 字典表示例
              return createElement(TableIcon, {
                props: {
                  flag: params.row.rejectClauseStatus,
                  titles: [{
                    status: 0,
                    title: '无效'
                  }, {
                    status: 1,
                    title: '有效'
                  }]
                }
              });
            }
          },
          {
            label: '采购组织',
            key: 'purOrgName',
            width: '200',
            align: 'center',
          }, {
            label: '物料编码',
            key: 'materialCode',
            align: 'center',
            width: '200',
          },
          {
            label: '物料名称',
            key: 'materialName',
            align: 'center',
            width: '200',
          }, {
            label: '供应商编码',
            key: 'vendorCode',
            width: '160',
            align: 'center',
          }, {
            label: '供应商名称',
            key: 'vendorName',
            width: '160',
            align: 'center',
          }, {
            label: '报价单号',
            key: 'quotationNo',
            width: '160',
            align: 'center',
          }, {
            label: '含税单价',
            key: 'taxPrice',
            width: '160',
            align: 'center',
          },{
            label: '不含税单价',
            key: 'noTaxPrice',
            width: '160',
            align: 'center',
          }, {
            label: '报价轮次',
            key: 'quoteTimes',
            width: '160',
            align: 'center',
          }, {
            label: '报价时间',
            key: 'publishDate',
            width: '160',
            align: 'center',
          }, {
            label: '报价截止时间',
            key: 'quoLimitTime',
            width: '160',
            align: 'center',
          }, {
            label: '驳回报价原因',
            key: 'rejectQuoteReason',
            width: '160',
            align: 'center',
          }
        ]
      };
    },
    methods: {

    }
  }

</script>
